<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<button>点我跳转</button>
		<input type="text" name="" id="" value="" />
		<button>点我前进</button>
		<button>点我cookie</button>
		<progress value="0" width="100px" height="20px" max="50"></progress>
		<script type="text/javascript">
			
			var btn = document.getElementsByTagName("button");
			var Input = document.getElementsByTagName("input")[0];
			var progress = document.getElementsByTagName("progress")[0];
			btn[0].onclick = function(){
				var inputValue = Input.value;
			}
			btn[1].onclick = function(){
				var inputValue = Input.value;
				var arr ={ 
					arr : [1,2,3,4,5,]
					};
				arr = JOSN.stringify(arr);
				localStorage.setItem("keyword",arr)
				
				
			}
			btn[2].onclick = function(){
				var inputValue = Input.value;
				var d = new Date(2017);
				var exp = new Date();
				exp.setTime(d.getTime() +60*1000);
				console.log(d.toGMTString())
				document.cookie = "baidu = "+inputValue+";Expires"+d.toGMTString();
			}
			
			var xhr = new XMLHttpRequest();
			var src ="http://wajy.gitee.io/text-progress/hanjiu.mp3"; 

			
			xhr.open('get',src,true);
			
			xhr.send();
			
			xhr.addEventListener("readystatechange",function(e){
				var res = e.target;
				if(res.readyState == 4){
					if(res.state ==200){
						console.log('请求成功');
					}
				}
			})
//			xhr.addEventListener("progress")
			
			xhr,onprogress = function(event){
				if(event.lengthComputable){
					var percentComplete = (event.loaded / event.total)*100+"px";
					progress.setAttribute("value",event.loaded);
					progress.setAttribute("max",event.total);
				}
			}
			
			
		</script>
		
		
		
	</body>
</html>
